<template>
	<view class="">
		<view class="title">
			<image src="@/static/images/login/union-icon.png" class="icon"></image> <text class="text">缴费历史</text>
		</view>
	</view>
	<scroll-view class="listview" style="flex: 1;" enableBackToTop="true" scroll-y @scrolltolower="loadData()">
		<view class="item" v-for="(item, index) in payData" :key="index" :index="index" @tap="moreTapItem(item, index)">
		    <uni-row style="margin-bottom: 25rpx;">
		        <uni-col :span="4">
		          <image  src="@/static/images/pay/pay-success.png" class="icon"></image>
		        </uni-col>
			  <uni-col :span="20" style="text-align: left;line-height: 50rpx;">
				  <view  class="name"> {{item.year}}年费用已缴清</view>
				  <uni-row>
					<uni-col :span="8" textAlign="right">缴费日期</uni-col>
				  	<uni-col :span="15" textAlign="right">
				  	    <view class="item-right snowy-bold snowy-ellipsis"> {{ item.createTime }} </view>
				  	</uni-col>
				  	
				 
				  </uni-row>
			  </uni-col>
		    </uni-row>
		
		</view>
	</scroll-view>
</template>


<script lang="ts" setup>
  import  bizFileManager  from '@/api/biz/biz-file-manager-api.js'
    // import more from './more.vue'
    import { onLoad, onShow, onReady, onPullDownRefresh, onReachBottom } from "@dcloudio/uni-app"
    import { reactive, ref, getCurrentInstance } from "vue"
    const { proxy } = getCurrentInstance()
    const searchFormState = reactive({
    })
    const parameter = reactive({
    	current: 1,
    	size: 10
    })
    const payData = ref([])
	
    const loadData = (isReset) => {
        if (isReset) {
        	parameter.current = 1
        	payData.value = []
        }
        Object.assign(parameter, searchFormState)
        bizFileManager.bizFileManagerPage(parameter).then(data => {
            if (uni.$xeu.isEmpty(data?.records)){
            	return
            }
			
            payData.value = payData.value.concat(data.records)
			payData.value = [{year:2024,createTime:'2025-01-08 13:45:08'}]
            parameter.current++
        }).finally(()=>{
          	uni.stopPullDownRefresh()
        })
    }
    loadData(true)
    onShow(() => {
    	uni.$once('formBack', (data) => {
            loadData(true)
    	})
    })
    // 下拉刷新
    onPullDownRefresh(() => {
    	loadData(true)
    })
    // 上拉加载
    onReachBottom(() => {
    	loadData()
    })
    // 新增
    const add = () => {
    	uni.navigateTo({
            url: '/pages/biz/filemanager/form'
    	})
    }
    // 更多操作
    const moreRef = ref()
    const moreTapItem = (item, index) => {
        moreRef.value.open(item)
    }


</script>
<style lang="scss">
	.title{
		text-align: center;
		line-height: 100rpx;
		display: flex;
		width: 40%;
		text-align: center;
		margin: 0 auto;
		justify-content: space-evenly;
		color: #C70707 100%;
		font-size: 40rpx;
		font-weight: bolder;
		font-style: italic;
		.icon{
			margin: 20rpx;
			height: 60rpx;
			width: 60rpx;
	
		}
		.text{
			color: #C70707;
			font-size: 40rpx;
			font-weight: bolder;
			font-style: italic;
		}
	}
	.listview{
		.icon{
			margin: 20rpx;
			height: 80rpx;
			width: 80rpx;
			
		}
		width: 96%;
		margin: 0 auto;
	}
	.item {
	
	    background: #ffffff;
	    box-shadow: 0 1px 2px #ccc;
	    border-radius: 15rpx;
	    .item-left {
	        color: #999;
	        font-size: 26rpx;
	    }
	    .item-right {
	        font-size: 26rpx;
	    }
		.name{
			padding-top: 10rpx;
			font-weight: bolder;
			font-size: 35rpx;
		}
		.date{
			color: #C0C0C0 100%;
		}
	}
	.item:hover {
	    box-shadow: 1upx 5upx 5upx #aaa;
	}
</style>

